<template>
  <div>
    <h2 style="margin-bottom:10px;">注册数：{{register}}</h2>
    <Table size="large" border :columns="dataTitle" :data="data"></Table>
  </div>
</template>

<script>
  export default {
    props:['nameSelect'],
    data () {
      return {
        tag: {
          'title': '客户转化率',
          'path': '/work/converRate/list'
        },
          register:'',
          dataTitle:[
          {
            title: '类型',
            key: 'type',
            align:'center',
             render: (h, params) => {
              return h('strong', params.row.type);
            }
          },
          {
            title: '身份证认证',
            key:'idCard',
            align:'center'
          },
          {
            title: '银行卡认证',
            key: 'bankCard',
            align:'center'
          },
          {
            title: '联系人认证',
            key: 'linkMan',
            align:'center',


          },
           {
            title: '运营商授权',
            key: 'operator',
            align:'center',


          },
           {
            title: '芝麻分授权',
            key: 'zmfScore',
            align:'center'

          },
           {
            title: '订单申请',
            key: 'order',
            align:'center',

          },
        ],
        data:[],
      }
    },
    mounted(){
      this.getData();
      this.tag.name = this.nameSelect;
      console.log(this.tag,'转换');
      this.$store.commit('changeTag', this.tag.path);
      this.$store.commit('openPage', this.tag);
    },
    methods: {
     getData(){
       this.$post('/statistics/customer/conversionRate').then(res => {
         console.log(res,'转化');
         let data = res.data;
         this.register = data.registerCount;
           this.data = [
                {
                  type:'数量',
                  idCard : data.iDCount,
                  bankCard : data.userBankCount,
                  linkMan: data.userBasiceCount,
                  operator:data.userCarrierCount,
                  zmfScore:data.zmfScoreCount,
                  order:data.userLoanCount,
                },
                {
                  type:'转化率(%)',
                  idCard :(data.iDRate*100).toFixed(2),
                  bankCard :(data.userBankRate*100).toFixed(2),
                  linkMan : (data.userBasiceRate*100).toFixed(2),
                  operator:(data.userCarrierRate*100).toFixed(2),
                  zmfScore:(data.zmfScoreRate*100).toFixed(2),
                  order:(data.userLoanRate*100).toFixed(2),
                },
              ]
       })
     }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .list-btn{
    margin-bottom: 5px;
    margin-right: 5px;
    display: inline-block;
  }
  .refresh-btn{
    float: right;
  }

</style>
